<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/vue.js"></script>
</head>
<body>
<div id="app">
{{name}}
<!--v-on:事件名=“函数"-->
    <button v-on:click="show()">点我提示信息</button>
    <button v-on:click="show">点我提示信息</button>

    <!--简写-->
    <button @click="show">点我提示信息</button>
    <button @click="show1(666)">点我提示信息</button>
</div>

</body>
<script>
    new Vue({
        el:'#app',
        data(){
            return{
                name:'张三'
            }
        },
        //函数定义的位置
        methods:{
            show() {
                alert("你好")
                //this 指的是vue也就是vm  所有在vm身上的东西最终都会出现this上
                console.log(this)
                console.log(this.name)
                this.name='我是从数据库查询过来的值';
            },
            show1(a){
                alert(a)
            }
        }
    });

</script>
</html>